<!DOCTYPE HTML>
<html>
<head>
<!--<meta http-equiv="refresh" content="10;URL=http://localhost/taggrezo/">-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name = "viewport" content = "user-scalable=no, width=device-width">
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>Flexisel - A responsive jQuery Carousel</title>
<link href="<?php echo $basePath; ?>/css/default.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $basePath; ?>/js/introductionJsCss/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php echo $basePath; ?>/js/project/jquery-172.min.js"></script>
<script src="<?php echo $basePath; ?>/js/introductionJsCss/jquery.flexisel.js"  type="text/javascript" ></script>
<!--[if lt IE 8]><style>
.wraptocenter span {
    display: inline-block;
    height: 100%;
}
</style><![endif]-->
</head>

<body>
<div class="window_center">
	<div class="" style="text-align:center;margin-bottom:10px;"><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/introduction-logo.png"></div>
<ul id="flexiselDemo2"> 
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/1.png" /></li>
	<div class="text_pos_ab"><div class="text_pos_cent">Login with <br/>Basic Information alone<br/>&nbsp;</div></div>
</div> 
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/2.png" /></li>
	<div class="text_pos_ab"><div class="text_pos_cent">Post <br/>Your Choice of Trending<br/>&nbsp;</div></div>
</div> 
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/3.png" /></li>
	<div class="text_pos_ab"><div class="text_pos_cent">Collect Links. Customize as per your Idea <br/>about anything or anyone<br/>&nbsp;</div></div>
</div> 
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/4.png" /></li>
	<div class="text_pos_ab"><div class="text_pos_cent">Collect 100 web links per category 
	<br/>1000 per User, recognizing 18 types of files<br/>&nbsp;</div></div>
</div> 
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/5.png" /></li>
	<div class="text_pos_ab"><div class="text_pos_cent">
	Multi selected dragging of Posts. 
	enabled free movement for 
	customization of your 
	Ideas and presentations</div></div>
</div>
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/6.png" /></li>
		<div class="text_pos_ab"><div class="text_pos_cent">
		Upload your Chrome and Mozilla’s <br/>
Bookmark files (.Json & .Bak) easy selection</br/>
of your choice Links for customization of your Ideas</div></div>
</div>
<div class="wraptocenter pos_r">
	<li><img src="<?php echo $basePath; ?>/js/introductionJsCss/images/7.png" /></li>
		<div class="text_pos_ab"><div class="text_pos_cent">Share Privately with a<br/> 
generated Encrypted combination</br/>
and regenerate everytime you need to change</div></div>
</div>
</ul>
	<div class="skip_c"><div class="skip_center"><a href="/" ><h3>Skip / Enter Website</h3></a></div></div>
</div>

<script type="text/javascript">

$(window).load(function() {
    $("#flexiselDemo1").flexisel();
    $("#flexiselDemo2").flexisel({
        enableResponsiveBreakpoints: true,
        responsiveBreakpoints: { 
            portrait: { 
                changePoint:480,
                visibleItems: 1
            }, 
            landscape: { 
                changePoint:640,
                visibleItems: 2
            },
            tablet: { 
                changePoint:768,
                visibleItems: 3
            }
        }
    });

    $("#flexiselDemo4").flexisel({
        clone:false
    });
    
	$(function window_center(){
		$('.window_center').each(function(){
			$(this).css('left',($(window).width()-$(this).width())/ 2 + 'px');
			$(this).css('top',($(window).height()-$(this).height())/ 2 + 'px');
		});
	});
	$( window ).resize(function() {
		$('.window_center').each(function(){
			$(this).css('left',($(window).width()-$(this).width())/ 2 + 'px');
			$(this).css('top',($(window).height()-$(this).height())/ 2 + 'px');
		});
	});
});
</script>
    
    
</body>
</html>